<template>
	<view class="shoplist">
		<view class="shoplist-head">
			<view v-for="(item,index) in nonotice" :key='item' @click="tab(index)" :class="index==ind?'border':''">
				{{item}}
				<!-- {{notice}} -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

				ind: 0
			};

		},
		props: {
			nonotice: '',
		},
		methods: {
			tab(e) {
				this.$emit('fatherMethod');
				this.$emit('evolve');
				if (e == 0) {
					this.ind = e
					this.$emit('fatherMethod',0);
					this.$emit('evolve',e);
				}
				if (e == 1) {
					this.ind = e
					this.$emit('fatherMethod',1);
					this.$emit('evolve',e);
				}
				if (e == 2) {
					this.ind = e
					this.$emit('fatherMethod',2);
					this.$emit('evolve',e);
				}
				if (e == 3) {
					this.ind = e
					this.$emit('evolve',e);
				}
				if (e == 4) {
					this.ind = e
				}
			}
		}
	}
</script>

<style lang="less">
	.shoplist-head {
		display: flex;
		height: 96rpx;
		font-size: 28rpx;
		line-height: 96rpx;
		text-align: center;
		background-color: #FFFFFF;
	}

	.shoplist-head>view {
		flex: 1;
	}

	.border {
		border-bottom: 4rpx solid #FB9C00;
	}
</style>
